<template>
  <div class="tourism-info">
    <div class="dkjsahdsja">
      <div @click="getCharts('已受理')" class="one" >
        <p>已受理</p>
      </div>
      <div @click="getCharts('三月内答复超时')" class="two">
        <p>三月内答复超时</p>
      </div>
      <div @click="getCharts('七日内回复')" class="three">
        <p>七日内回复</p>
      </div>
      <div @click="getCharts('七日内回复超时')" class="four">
        <p>七日内回复超时</p>
      </div>
      <div @click="getCharts('已完结')" class="five">
        <p>已完结</p>
      </div>
      <div @click="getCharts('已分流')" class="six">
        <p>已分流</p>
      </div>
      <div @click="getCharts('三月内答复')" class="seven">
        <p>三月内答复</p>
      </div>
    </div>
  </div>
</template>
<script>
  export default {
    data() {
      return {};
    },
    computed: {},
    methods: {
      getCharts(text) {
        console.log(text);
        
      },
    },
    mounted() {},
    beforeUnmount() {},
  };
</script>
<style scoped lang="scss">
  .tourism-info {
    margin-top: 34px;
    width: 900px;
    height: 285px;
    color: #fff;

    .dkjsahdsja {
      width: 100%;
      height: 100%;
      position: relative;

      div {
        width: 100px;
        height: 100px;
        color: #fff;
        display: flex;
        justify-content: center;
        align-items: center;

        p {
          width: calc(7ch);
          font-size: 12px;
          word-wrap: break-word;
          overflow-wrap: break-word;
          white-space: normal;
        }
      }

      .one {
        position: absolute;
        left: 98px;
        top: 2px;
      }

      .two {
        position: absolute;
        left: 504px;
        top: 4px;
      }

      .three {
        position: absolute;
        left: 55px;
        top: 118px;
      }

      .four {
        position: absolute;
        left: 577px;
        top: 113px;
      }

      .five {
        position: absolute;
        left: 466px;
        top: 179px;
      }

      .six {
        position: absolute;
        left: 168px;
        top: 185px;
      }

      .seven {
        position: absolute;
        left: 315px;
        top: 199px;
      }
    }
  }
</style>
